<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<meta HTTP-EQUIV="Pragma" CONTENT="no-cache">
		<meta HTTP-EQUIV="Cache-Control" CONTENT="no-cache">
		<meta HTTP-EQUIV="Expires" CONTENT="0">
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
		<link rel="stylesheet" type="text/css" href="resources/jquery-easyui-1.7.0/themes/metro/easyui.css"/>
		<link rel="stylesheet" type="text/css" href="resources/jquery-easyui-1.7.0/themes/mobile.css"/>
		<link rel="stylesheet" type="text/css" href="resources/jquery-easyui-1.7.0/themes/icon.css"/>
		
		<script src="resources/jquery-easyui-1.7.0/jquery.min.js" type="text/javascript" ></script>
		<script src="resources/jquery-easyui-1.7.0/jquery.easyui.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="resources/jquery-easyui-1.7.0/jquery.easyui.mobile.js" type="text/javascript" charset="utf-8"></script>
		<script src="resources/jquery-easyui-1.7.0/locale/easyui-lang-zh_CN.js" type="text/javascript" charset="utf-8"></script>
		<title></title>
		<script type="text/javascript">
			$(function(){
				$("#loginSubmit").click(function(){
					
					if($("#email").val() == "Email" || $("#email").val() == ""){
					    alert("请您认真填写用户名！");
					    return false;
					}else if($("#password").val() == "Password" || $("#password").val() == ""){
					    alert("请您认真输入密码！");
					    return false;
					}else if($("#checkCode").val() == "" || $("#checkCode").val() == "checkCode"){
					    alert("请您输入验证码");
					    return false;
					}
					this.disabled = true;
					$('#loginForm').submit();
				});
				
				$("#registerSubmit").click(function(){
					
					if( $("#emailR").val() == ""){
					    alert("请您认真填写邮箱！");
					    return false;
					}else if($("#passwordR").val() == ""){
					    alert("请您认真输入密码！");
					    return false;
					}else if($("#checkCodeR").val() == "" ){
					    alert("请您输入验证码");
					    return false;
					}else if($("#usernameR").val() == "" ){
					    alert("请您认真填写用户名！");
					    return false;
					}
					this.disabled = true;
					$('#registerForm').submit();
				});
			})
		</script>
	</head>
	<body>
		

	<div class="easyui-navpanel" >
		<div style="margin: 17% 42%;">
			<a href="javascript:void(0)" class="easyui-linkbutton" data-options="plain:true,outline:true" style="width:80px;height:30px" onclick="$('#login').dialog('open').dialog('center')">Login</a>
			<br><br>
			<a href="javascript:void(0)" class="easyui-linkbutton" data-options="plain:true,outline:true" style="width:80px;height:30px" onclick="$('#register').dialog('open').dialog('center')">Register</a>
		</div>
		<div id="login" class="easyui-dialog" style="padding:20px 6px;width:80%;" data-options="inline:true,modal:true,closed:true,title:'Login'">
			<form id ="loginForm"action="login" method="post">
				<div style="margin-bottom:10px">	
					<div>Email:</div>
					<input id="email" name="email" class="easyui-textbox" data-options="prompt:'Enter a email address...'" style="width:100%;height:32px">
				</div>
				<div style="margin-bottom:10px">
					<div>Password:</div>
					<input id="password" name="password" class="easyui-textbox" data-options="prompt:'Enter a password...',type:'password'" style="width:100%;height:32px">
				</div>
				<div style="margin-bottom:10px">
					<div>CheckCode:</div>
					<input id="checkCode" name="checkCode" class="easyui-textbox" data-options="prompt:'Enter a checkcode...'" style="width:100%;height:32px">
				</div>
				<div style="text-align:center;margin:5px 30px">
					<img alt="验证码" src="login/checkCode"/>
					<br>remember me for<br>
						<input type="radio" name="expiredays" value="7"/>a week
						<input type="radio" name="expiredays" value="30"/>a month
						<input type="radio" name="expiredays" value="100"/>forever
					<br>
				</div>
			</form>
			<div style="margin-bottom:10px">	
				<div class="dialog-button">
					<a id="loginSubmit" href="javascript:void(0)" class="easyui-linkbutton" style="width:100%;height:35px" >提 交</a>
				</div>
			</div>
		</div>
		
		<div id="register" class="easyui-dialog" style="padding:20px 6px;width:80%;" data-options="inline:true,modal:true,closed:true,title:'Register'">
			<form id ="registerForm"action="login/register" method="post">
				<div style="margin-bottom:10px">	
					<div>Email:</div>
					<input id="emailR" name="email" class="easyui-textbox" data-options="prompt:'Enter a email address...',validType:'email'" style="width:100%;height:32px">
				</div>
				<div style="margin-bottom:10px">
					<div>Username:</div>
					<input id="usernameR" name="username" class="easyui-textbox" data-options="prompt:'Enter a name...',type:'text'" style="width:100%;height:32px">
				</div>
				<div style="margin-bottom:10px">
					<div>Password:</div>
					<input id="passwordR" name="password" class="easyui-textbox" data-options="prompt:'Enter a password...',type:'password'" style="width:100%;height:32px">
				</div>
				<div style="margin-bottom:10px">
					<div>CheckCode:</div>
					<input id="checkCodeR" name="checkCode" class="easyui-textbox" data-options="prompt:'Enter a checkcode...'" style="width:100%;height:32px">
				</div>
				<div style="text-align:center;margin:5px 30px">
					<img alt="验证码" src="login/checkCode"/>
				</div>
			</form>
			<div style="margin-bottom:10px">	
				<div  class="dialog-button">
					<a id="registerSubmit" href="javascript:void(0)" class="easyui-linkbutton" style="width:100%;height:35px" onclick="$('#register').dialog('close')">提 交</a>
				</div>
			</div>
		</div>
	</div>
	</body>
</html>
